<template>
	<view class="container">
		<!-- 圆圈状加载特效 -->
		<view class="loader"></view>
		<!-- 提示信息区域 -->
		<view class="message-section">
			<text class="message-text">订单已提交，待管理员进行审核通过，您可在我的订单中进行查看</text>
		</view>
		<!-- 返回首页按钮区域 -->
		<view class="button-section">
			<button class="back-button" @click="goBackHome">返回首页</button>
		</view>
	</view>
</template>

<script setup>
	import {
		onLoad,
		onShow,
		onUnload
	} from '@dcloudio/uni-app';

	onUnload(() => {
		uni.switchTab({
			url: "/pages/taxiHailing/taxiHailing"
		})
	})
	// 返回首页的方法
	const goBackHome = () => {
		// 这里假设首页路径为'/pages/index/index'，你需要根据实际项目的首页路径进行修改
		uni.switchTab({
			url: '/pages/taxiHailing/taxiHailing'
		});
	};
</script>

<style scoped>
	.container {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		min-height: 100vh;
		background-color: #f4f4f4;
		position: relative;
	}

	.message-section {
		margin-bottom: 20px;
		text-align: center;
	}

	.message-text {
		font-size: 16px;
		color: #333;
		line-height: 1.5;
	}

	.button-section {
		text-align: center;
	}

	.back-button {
		padding: 0px 20px;
		background-color: #007AFF;
		color: white;
		border: none;
		border-radius: 5px;
		font-size: 16px;
		cursor: pointer;
	}

	/* 圆圈状加载特效样式 */
	.loader {
		border: 10px solid #f3f3f3;
		border-top: 10px solid #007AFF;
		border-radius: 50%;
		width: 60px;
		height: 60px;
		animation: spin 1s linear infinite;
		margin-bottom: 20px;
	}

	@keyframes spin {
		0% {
			transform: rotate(0deg);
		}

		100% {
			transform: rotate(360deg);
		}
	}
</style>